/*
 * @Author: wangdengduo
 * @Date: 2023-05-06 14:01:41
 * @LastEditors: wangdengduo
 * @LastEditTime: 2023-05-09 20:32:15
 * @FilePath: \todo-list\src\pages\home\index.js
 * @Description
 */
import React from "react";
import { Outlet } from "react-router-dom";
import { Layout, Space } from "antd";
import "./index.css";
import HeaderBar from "@/components/hederBar";
import SiderNav from "@/components/siderNav";
import { useContext } from "react";
import { searchContext } from "@/store";

const { Header, Sider, Content } = Layout;

const Home = () => {
  const { theme } = useContext(searchContext);

  
  return (
    <Space
      direction="vertical"
      style={{
        width: "100%",
      }}
      size={[0, 48]}
      className={theme}
    >
      <Layout className="content-container">
          <Header className="header">
            <HeaderBar />
          </Header>
          <Layout>
            <Sider className="left-sider">
              <SiderNav />
            </Sider>
            <Content className="main-content">
              <Outlet />
            </Content>
          </Layout>
      </Layout>
    </Space>
  );
};

export default Home;
